<template>
  <div class="home-view-list">
    <component
      :is="comp"
      :itemlist="itemlist"
      :category="category"
      :play-status="playStatus"
      @set-play-status="setPlayStatus"
    />
  </div>
</template>

<script>
import ArticleCard from "@/components/ArticleCard.vue";
import PhotographyCard from "@/components/PhotographyCard";
export default {
  name: "HomeViewList",
  props: {
    itemlist: Object,
    category: {
      type: String,
      require: true,
    },
    playStatus: Boolean,
  },
  data() {
    return {};
  },

  mounted() {},
  computed: {
    comp() {
      return this.category == 0 ? "PhotographyCard" : "ArticleCard";
    },
  },
  methods: {
     setPlayStatus(){
      this.$emit('set-play-status');
    }
  },
  components: {
    ArticleCard,
    PhotographyCard,
  },
};
</script>

<style lang="scss" scoped>
</style>